<template>
  <view class="fedbackContent">
    <!-- 触发弹窗的按钮 -->
    <uni-list v-if="!questionId">
      <uni-list-item
        title="系统反馈"
        link
        showArrow
        @click="showFeedbackForm"
      />
    </uni-list>
    <uni-icons
      v-else
      @click="showFeedbackForm"
      type="compose"
      size="40"
      color="#01bafd"
    ></uni-icons>
    <!-- {{questionId}}+++ -->
    <!-- 弹窗 -->
    <uni-popup ref="popup" type="dialog">
      <!-- 弹窗内容 -->
      <uni-popup-dialog
        @close="closefn"
        @confirm="confirm"
        :title="feedbackTitle"
      >
        <!-- 下拉框选择反馈类型 -->
        <view class="select" >

          <uni-data-checkbox v-model="abnormalTypeId" :localdata="abnormalTypeList"></uni-data-checkbox>
        </view>
        <view class="input">
          <uni-easyinput
            type="textarea"
            maxlength="-1"
            autoHeight
            v-model="abnormalContent"
            placeholder="请输入您的反馈意见"
          ></uni-easyinput>
        </view>
      </uni-popup-dialog>
    </uni-popup>
  </view>
</template>
  
  <script setup>
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import http from "@/utils/request";

const abnormalContent = ref("");
const popup = ref(null);
const abnormalTypeId = ref("1");
const abnormalTypeList = ref([]);
//获取系统反馈类型
onLoad(async () => {
  let { data, code } = await http.post("myAbnormal/typeList");
    if (code == 200) {
      abnormalTypeList.value = data;
      //将dictKey改为value，将dictValue改为text
      abnormalTypeList.value.forEach((item) => {
        item.value = item.dictKey;
        item.text = item.dictValue;
      });
    }
});

// 接受参数
const props = defineProps({
  feedbackTitle: {
    type: String,
    default: "系统异常反馈",
  },
  feedbackButtonText: {
    type: String,
    default: "反馈异常",
  },
  // 是否显示问题ID
  questionId: {
    type: [String, Number],
    default: null,
  },
});

// 显示反馈表单
const showFeedbackForm = () => {
  popup.value.open();
};
const closefn = () => {
  popup.value.close();
  //清空反馈内容
  abnormalContent.value = "";
  abnormalTypeId.value = "1";
};
// 提交反馈
const confirm = async () => {
  //校验
  if (!abnormalContent.value) {
    uni.showToast({
      title: "请输入反馈内容",
      icon: "none",
    });
    return;
  }
  // 这里可以处理提交逻辑，比如发送请求等
  let requestData = {
    abnormalContent: abnormalContent.value,
    abnormalTypeId: props.questionId ? 3 : abnormalTypeId.value,
	type:2,
  };

  if (props.questionId) {
    requestData.questionId = props.questionId;
  }

  let { data, code } = await http.post("myAbnormal/add", requestData);

  if (code === 200) {
    uni.showToast({
      title: "提交成功",
      icon: "success",
    });
    closefn();
  }
  // 取消反馈
};
</script>
<style   lang="scss" scoped>
.fedbackContent {
  ::v-deep.uni-popup-dialog {
    width: 650rpx;
  }
  ::v-deep .uni-dialog-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 30rpx;
    .select {
      width: 98%;
      margin-bottom: 36rpx;
    }
    .input {
      width: 98%;
    }
  }
}
</style>